<template>
  <div class="ja-container">
    <div class="flex-row">
      <div class="material-textfield green form-left" :class="{'validate-err': errors.has('contactsName')}">
        <input type="text" required v-model="info.contactsName"  v-validate="'required'" name="contactsName"/>
        <label data-content="职称申报联系人*">职称申报联系人*</label>
      </div><!--
    --><div class="material-textfield green form-right" :class="{'validate-err': errors.has('contactsPhone')}">
        <input type="text" required v-model="info.contactsPhone"  v-validate="'required|fax'" name="contactsPhone"/>
        <label data-content="联系方式*">联系方式*</label>
      </div>
    </div>

    <div class="flex-row ">
      <div class="material-textfield green form-left" :class="{'validate-err': errors.has('department')}">
        <input type="text" required v-model="info.department"  v-validate="'required'" name="department"/>
        <label data-content="工作部门*">工作部门*</label>
      </div>
    </div>


    <!-- <div class="tc">
      <el-button type="success width-200" plain round>保存</el-button>
    </div> -->
  </div>
</template>

<script>
  export default {
    title: '公司基本信息',
    name: 'company-info',
    props: {
      companyinfo: {}
    },
    data () {
      return {
        info: {}
      }
    },
    mounted () {
      this.info = Object.assign({}, this.companyinfo)
    },
    methods: {
      validate () {
        return this.$validator.validateAll()
      }
    },
    watch: {
      'info': {
        handler: function (val, oldVal) {
          this.$emit('update:companyinfo', this.info)
        },
        deep: true
      }
    }
  }
</script>
